<div class="panel panel-default">
	<div class="panel-heading">
		<span> Book Detail </span>
	</div>
	<div class="panel-body">
		<div class="row">
			<div class="col-sm-6">
		    	<!-- <img ng-src="img/{{book.id}}.png" class="img-responsive img-rounded" alt="{{book.title}}"> -->
		    	<img ng-src="img/{{cover}}.png" class="img-responsive img-rounded" alt="{{book.title}}">
	    	</div>
			<div class="col-sm-6">
				<dl class="dl-horizontal">
					<dt>Title</dt>
					<dd>{{book.title}}</dd>
					<dt>Author</dt>
					<dd>{{book.author}}</dd>
					<dt>Price</dt>
					<dd>{{book.price}}</dd>
					<dt>Pubdata</dt>
					<dd>{{book.pubdata}}</dd>
				</dl>
				<div class="row">
					<div class="col-sm-3" ng-repeat="bk in book.images">
						<!-- <img ng-src="img/{{bk}}.png" class="img-responsive" alt="{{bk}}"> -->
						<img ng-click="setCover(bk)" ng-src="img/{{bk}}.png" class="img-responsive" alt="{{bk}}">
					</div>
				</div>
			</div>
		</div>
	</div>
	<div class="panel-footer">
		<a href="javascript:history.back()">Back list</a>
	</div>
</div>